<template>
    <div class="tc-right">
        <div class="tc-righttop-tab j-tc-righttop-tab">
            <ul class="RTtab clearfix">
                <!-- <li class="visitTab-btn RTtab-active2 fl">设计回访</li> -->
                <!-- <li class="visitTab-btn RTtab-active3 fl">客户回访</li> -->
                <!-- <li class="list-btn RTtab-active fl">其他按钮</li> -->
                <li class="list-btn RTtab-active fr">
                    <router-link :to="routerPath('list')">列表</router-link>
                </li>
            </ul>
        </div>
        <div class="tc-right-top clearfix">
            <div class="fl needdealt">
                <!-- <ul>
                <li class="bgRed">待办一</li>
                <li class="bgOrange">待办二</li>
                <li class="bgGreen">待办三</li>
            </ul> -->
            </div>
            <div class="visitbox">
                <!-- 回访内容 #j-visit 是一个整体内容 切换列子看 Index/Right-->
                <div class="visit" id="j-visit" v-scrollHeight="250">
                    <div v-if="visitList!=null && visitList.length>0">
                        <div v-for="(item, index) in visitList" :key="index">
                            <div class="visi-list tx-left" v-if="item.logtype==21">
                                <div class="visi-listtop">
                                    <span class="visi-name">地</span>
                                    <span class="visi-date">{{item.createtime|splitTimeEnd}}</span>
                                    <span class="visi-date">{{item.labels}}</span>
                                    <span v-if="item.importance!=0" :class="item.importance=='0'? '':(item.importance=='1'? 'cOrange':(item.importance=='2'? 'cRed':(item.importance=='3'? 'cRed':(item.importance=='4'? 'cBlue':(item.importance=='5'? 'cgreen':(item.importance=='6'? 'cGreen':(item.importance=='8'?'cRed':(item.importance=='9'?'cOrange':''))))))))">
                                        {{item.importance|importantce}}<span class="ml10">{{item.money==0?'':item.money}}</span></span>
                                </div>
                                <p class="visi-listtxt" style="margin-left: 35px;"> {{item.logcontent}}</p>
                            </div>
                            <div class="visi-list tx-right" v-if="item.logtype==10">
                                <div class="visi-listtop">
                                    <span v-if="item.importance!=0" :class="item.importance=='0'? '':(item.importance=='1'? 'cOrange':(item.importance=='2'? 'cRed':(item.importance=='3'? 'cRed':(item.importance=='4'? 'cBlue':(item.importance=='5'? 'cgreen':(item.importance=='6'? 'cGreen':(item.importance=='8'?'cRed':(item.importance=='9'?'cOrange':''))))))))">
                                        <span class="mr10">{{item.money==0?'':item.money}}</span>{{item.importance|importantce}}</span>
                                    <span class="visi-date">{{item.labels}}</span>
                                    <span class="visi-date">{{item.createtime}}</span>
                                    <span class="visi-name">集</span>
                                </div>
                                <p class="visi-listtxt cBlue" style="margin-left: 35px;">
                                    {{item.logcontent}}
                                </p>
                            </div>
                        </div>
                    </div>
                    <div v-else>
                        <img src="https://pa.rxjy.com/abc/static/images/empty.png">
                    </div>
                </div>
            </div>
        </div>
        <div class="tc-right-bottom pa10 relative">
            <div class="tc-right-bottom-left relative">
                <ul class="topdaily">
                    <li class="cRed">
                        <a @click="choice(0)" :class="{'cRed':this.flag ==0}" class="topdailybtn" href="javascript:">正常</a>
                    </li>
                    <li>
                        <a @click="choice(9)" :class="{'cRed':this.flag == 9}" class="topdailybtn" href="javascript:">异常</a>
                    </li>
                    <li>
                        <a @click="choice(8)" :class="{'cRed':this.flag == 8}" class="topdailybtn" href="javascript:">问题</a>
                    </li>
                </ul>
                <div>
                    <textarea v-model="text" style="height:150px;width:100%; border:none" placeholder="请输入回访问题"></textarea>
                </div>
                <input type="button" class="uiBtn-normal uiBtn-blue mt10" value="提交" @click="submitData()" style="margin: 0 auto;
    display: block;">
            </div>
            <!-- <div class="EventpenaltyDiv">
            <a href="javascrpit:;" class="EventpenaltyBtn">事件平台</a>
            <a href="javascrpit:;" class="EventpenaltyBtn">平台</a>
        </div> -->
        <div class="EventpenaltyDiv">
            <div href="javascrpit:;" class="EventpenaltyBtn" @click="pressrourt(1)">消息推送</div>
        </div>
        </div>
        <!-- 三段渲染容器 -->
        <transition class="animated faster" enter-active-class="animated faster slideInLeft" leave-active-class="animated faster slideOutLeft">
            <router-view></router-view>
        </transition>
    </div>
</template>
<script>
import { mapGetters, mapMutations } from 'vuex'
import {
    GetUserListByCondition, PMUserSave
} from '../Resources/Api'
export default {
    name: '',
    components: {

    },
    computed: {
        ...mapGetters(['leftInfo'])
    },
    mounted () {
        this.pmVisit()
    },
    data () {
        return {
            flag: 0,
            visitList: [],
            text: ''
        }
    },
    methods: {
        submitData () {
            PMUserSave({
                logtype: 10,
                orderno: this.leftInfo.uid,
                importance: this.flag,
                logcontent: this.text
            }).then(result => {
                this.$message('回访成功！')
                this.text = ''
                this.pmVisit()
            }).catch(err => {
                console.log(err)
            })
        },
        ...mapMutations({
            settwoUpdatePlate: 'SET_TWOUPDATE_PLATE'
        }),
        choice (index) {
            this.flag = Number(index)
        },
        // 路由跳转路径拼接
        routerPath (path) {
            return this.$route.matched[1].path + '/' + path
        },
        pmVisit () {
            GetUserListByCondition({
                id: this.leftInfo.uid
            }).then(result => {
                this.visitList = result.data.Body
                console.log()
            }).catch(err => {
                console.log(err)
            })
        },
        pressrourt (index) {
            this.settwoUpdatePlate(1)
            this.$router.push('/projectFiles/Person/notice')
        },
        // 直接进行路由跳转路径
        routerPush (path) {
            this.$router.push(this.$route.matched[1].path + '/' + path)
        }
    },
    watch: {
        leftInfo () {
            this.pmVisit()
        }
    },
    filters: {
        importantce (parone) {
            let value = ''
            parone = Number(parone)
            switch (parone) {
            case 0:
                value = '正常'
                break
            case 1:
                value = '整改'
                break
            case 2:
                value = '冻结'
                break
            case 3:
                value = '处罚'
                break
            case 4:
                value = '培训'
                break
            case 5:
                value = '解答'
                break
            case 6:
                value = '奖励'
                break
            case 7:
                value = '结业'
                break
            case 8:
                value = '问题'
                break
            case 9:
                value = '异常'
                break
            case 11:
                value = '待离'
                break
            }
            return value
        },
        splitTimeEnd (str) {
            str = String(str)
            if (str.length > 16) {
                var time = new Date()
                var y = String(time.getFullYear())
                var strr = str.substr(0, 4)
                if (y === strr) {
                    return str.substr(5, 11)
                } else {
                    return str.substr(0, 16)
                }
            } else {
                return str
            }
        }
    }
}
</script>
<style scoped>
a.topdailybtn.cRed {
  color: #fff;
  background-color: #0e92ff;
}
.tc-right-bottom-left {
  margin-right: 20px;
  height: 100%;
}
</style>
